import circle from './circle'
import triangle from './triangle'
import normal from './normal'
import rightTop from './rightTop'
import topBoth from './topBoth'
import leftTitle from './leftTitle'
import centerTitle from './centerTitle'
var Heter = {};
Heter.circle = circle;
Heter.triangle = triangle;
Heter.normal = normal;
Heter.rightTop = rightTop;
Heter.topBoth = topBoth;
Heter.leftTitle = leftTitle;
Heter.centerTitle = centerTitle;
Heter.types = ['circle', 'triangle', 'normal', 'rightTop', 'topBoth', 'leftTitle', 'centerTitle'];
Heter.init = function (arr) {
    arr.forEach(item => {
        if (this.checkItem(item)) {
            this.creatDom(item);
            this[item.type]();
        }

    });
}
Heter.creatDom = function (obj) {
    var container = document.getElementById(obj.domID);
    var type = obj.type;
    var titledom='';
    switch (obj.type) {
        case 'leftTitle':
        
        titledom=`<div class="heter-title heter-title-left">${obj.title}</div>`
            break;
            case 'centerTitle':
        titledom=`<div class="heter-title heter-title-center">${obj.title}</div>`
            
                break;
        default:
            break;
    }
    var html = `<div class="heter-container">
<div class="heter-dom heter-${type}">${titledom}</div>
<div class="heter-dom heter-${type} heter-${type}-respire">${titledom}</div>
<div class="heter-dom heter-${type} heter-${type}-streamer">
${titledom}
    <canvas class="heter-canvas" id="heter-${type}"></canvas>
</div>
</div>`;
    container.innerHTML = html;
}
Heter.checkItem = function (obj) {
    if (!obj.type) {
        console.log("%c请填写类型", "color:#f00");
        return false;
    }
    if (this.types.indexOf(obj.type) < 0) {
        console.log("%c 没有" + obj.type + "类型", "color:#f00");
        return false;
    }
    return true;
}
export default Heter;
